<!DOCTYPE html>
<html>
<head lang="en">
	<meta charset="UTF-8">
<title>带关闭按钮的滚动广告</title>
<style type="text/css">
#main{ text-align:center;}
#float{
	position:absolute;
	left:30px;
	top:60px; 
	z-index:1;
	}
#close{
	position:absolute;
	top:60px;
	left:134px;
	z-index:2;
	cursor:hand;
}
</style>
</head>
<body>
<div id="close" onClick="adv_close()"><img src="img/handson4/close.jpg"></div>
<div id="float"><img src="img/handson4/advpic.jpg"></div>
<div id="main"><img src="img/handson4/contentpic.jpg"></div>
<script type="text/javascript">
	var adverObj;
	var adverObj1;
	var top1;
	var top2;
	var left1 ;
	var left2;
	function inix(){
		adverObj = document.getElementById("close");
		adverObj1 = document.getElementById("float");
		
		if(adverObj.currentStyle){
			top1 = parseInt(adverObj.currentStyle.top);
			top2 = parseInt(adverObj1.currentStyle.top);
			left1 = parseInt(adverObj.currentStyle.left);
			left2 = parseInt(adverObj1.currentStyle.left);
		}else{
			top1 = parseInt(document.defaultView.getComputedStyle(adverObj,null).top);
			top2 = parseInt(document.defaultView.getComputedStyle(adverObj1,null).top);
			left1 = parseInt(document.defaultView.getComputedStyle(adverObj,null).left);
			left2 = parseInt(document.defaultView.getComputedStyle(adverObj1,null).left);
		}
	}
	
	function move(){
		var sTop1 = parseInt(document.documentElement.scrollTop||document.body.scrollTop);
		var sTop2 = parseInt(document.documentElement.scrollTop||document.body.scrollTop);
		var sLeft1 = parseInt(document.documentElement.scrollLeft||document.body.scrollLeft);
		var sLeft2 = parseInt(document.documentElement.scrollLeft||document.body.scrollLeft);
		adverObj.style.top = top1+sTop1 + "px";
		adverObj.style.left = left1+sLeft1 +30+ "px";
		adverObj1.style.top = top2+sTop2 + "px";
		adverObj1.style.left = left2+left2 + "px";
	}
	function adv_close(){
		adverObj.style.display = "none";
		adverObj1.style.display = "none";
	}
	window.onload = inix;
	window.onscroll = move;
</script>
</body>
</html>
